[
    {
        "h2": "Accessibility Support"
    },
    {
        "p": "Out of the box, the Telerik and Kendo UI AI Prompt provides extensive accessibility support and enables users with disabilities to acquire complete control over its features."
    },
    {
        "p": "The AI Prompt is compliant with the [Web Content Accessibility Guidelines (WCAG) 2.2 standards](https://www.w3.org/TR/WCAG22/) and [Section 508](http://www.section508.gov/) requirements, follows the [Web Accessibility Initiative - Accessible Rich Internet Applications (WAI-ARIA)](https://www.w3.org/WAI/ARIA/apg/) best practices for implementing the [keyboard navigation](#keyboard-navigation) for its `component` role, provides options for [managing its focus](#managing-the-focus) and is tested against the most popular [screen readers](#screen-readers)."
    },
    {
        "h3": "WAI-ARIA"
    },
    {
        "p": "This section lists the selectors, attributes, and behavior patterns supported by the component and its composite elements, if any."
    },
    {
        "h4": "AI Prompt"
    },
    {
        "p": "The AI Prompt component is a composite one and integrates the accessibility of the Toolbar, TextArea, Card, Chip and FloatingActionButton."
    },
    {
        "h4": "TextArea Component"
    },
    {
        "link": {
            "title": "TextArea accessibility specification",
            "source": "{{textarea_a11y_link}}"
        }
    },
    {
        "h4": "TextArea Adornments"
    },
    {
        "table": {
            "headers": [
                "Selector",
                "Attribute",
                "Usage"
            ],
            "rows": [
                {
                    "Selector": "`.k-textarea-prefix>.k-button`",
                    "Attribute": "`role=button` or `nodeName=button`",
                    "Usage": "The buttons must have appropriate role."
                },
                {
                    "Selector": "",
                    "Attribute": "`aria-label` or `title`",
                    "Usage": "The buttons must be properly labelled."
                },
                {
                    "Selector": "`.k-textarea-suffix>.k-button`",
                    "Attribute": "`role=button` or `nodeName=button`",
                    "Usage": "The buttons must have appropriate role."
                },
                {
                    "Selector": "",
                    "Attribute": "`aria-label` or `title`",
                    "Usage": "The buttons must be properly labelled."
                },
                {
                    "Selector": "`.k-textarea-suffix>.k-prompt-send.k-disabled`",
                    "Attribute": "`aria-disabled=true`",
                    "Usage": "Announces send action as disabled if necessary."
                }
            ]
        }
    },
    {
        "h4": "Suggestion Component"
    },
    {
        "p": "The Suggestion list implements roving tabindex navigation. Meaning that only one suggestion has tabindex=0. The display of the suggestion list is controlled by the expand button."
    },
    {
        "table": {
            "headers": [
                "Selector",
                "Attribute",
                "Usage"
            ],
            "rows": [
                {
                    "Selector": "`.k-prompt-expander .k-button`",
                    "Attribute": "`aria-controls=.k-prompt-expander-content id`",
                    "Usage": "Points to the controlled element based on the given `id`."
                },
                {
                    "Selector": "",
                    "Attribute": "`aria-expanded=true/false`",
                    "Usage": "Indicates the expanded state of the prompt expander content."
                },
                {
                    "Selector": "`.k-prompt-expander .k-suggestion-group`",
                    "Attribute": "`role=group`",
                    "Usage": "Indicates that the suggestion container element is a group."
                },
                {
                    "Selector": "`.k-prompt-expander .k-suggestion`",
                    "Attribute": "`role=button`",
                    "Usage": "Indicates that the suggestion element is a button."
                },
                {
                    "Selector": "",
                    "Attribute": "`aria-label` or `title`",
                    "Usage": "The suggestion elements must be properly labelled."
                },
                {
                    "Selector": "",
                    "Attribute": "`tabindex=0`",
                    "Usage": "The suggestion element should be focusable."
                }
            ]
        }
    },
    {
        "h4": "Button Component"
    },
    {
        "link": {
            "title": "Button accessibility specification",
            "source": "{{button_a11y_link}}"
        }
    },
    {
        "h4": "Adaptive Mode"
    },
    {
        "p": "When the AI Prompt component is in adaptive mode, the popup element follows the specifications of the ActionSheet component."
    },
    {
        "link": {
            "title": "ActionSheet accessibility specification",
            "source": "{{actionsheet_a11y_link}}"
        }
    },
    {
        "h4": "Toolbar Component"
    },
    {
        "link": {
            "title": "ToolBar accessibility specification",
            "source": "{{toolbar_a11y_link}}"
        }
    },
    {
        "h4": "Card List Container"
    },
    {
        "link": {
            "title": "CardList accessibility specification",
            "source": "{{cardlist_a11y_link}}"
        }
    },
    {
        "h4": "Card Component"
    },
    {
        "link": {
            "title": "Card accessibility specification",
            "source": "{{card_a11y_link}}"
        }
    },
    {
        "h4": "Chip Component"
    },
    {
        "link": {
            "title": "Chip accessibility specification",
            "source": "{{chip_a11y_link}}"
        }
    },
    {
        "h4": "ChipList Component"
    },
    {
        "link": {
            "title": "ChipList accessibility specification",
            "source": "{{chiplist_a11y_link}}"
        }
    },
    {
        "h4": "ContextMenu Component"
    },
    {
        "link": {
            "title": "ContextMenu accessibility specification",
            "source": "{{contextmenu_a11y_link}}"
        }
    },
    {
        "h4": "FloatingActionButton Component"
    },
    {
        "link": {
            "title": "FloatingActionButton accessibility specification",
            "source": "{{floatingactionbutton_a11y_link}}"
        }
    },
    {
        "h4": "SpeechToTextButton Component"
    },
    {
        "link": {
            "title": "SpeechToTextButton accessibility specification",
            "source": "{{speechtotextbutton_a11y_link}}"
        }
    },
    {
        "h4": "More Actions View - PanelBar Component"
    },
    {
        "link": {
            "title": "PanelBar accessibility specification",
            "source": "{{panelbar_a11y_link}}"
        }
    },
    {
        "h3": "Keyboard Shortcuts"
    },
    {
        "p": "This section lists the keyboard shortcuts supported by the AI Prompt composite component."
    },
    {
        "table": {
            "headers": [
                "Shortcut",
                "Behavior"
            ],
            "rows": [
                {
                    "Shortcut": "`Escape`",
                    "Behavior": "If generating, stops the generation process."
                }
            ]
        }
    },
    {
        "h4": "Prompt Suggestion Component"
    },
    {
        "p": "The expand header button and the suggestion group elements are included in the tab sequence."
    },
    {
        "table": {
            "headers": [
                "Shortcut",
                "Behavior"
            ],
            "rows": [
                {
                    "Shortcut": "`Enter/Space`",
                    "Behavior": "Triggers a click action."
                }
            ]
        }
    },
    {
        "h4": "Button Component"
    },
    {
        "link": {
            "title": "Button  specification",
            "source": "{{button_kb_link}}"
        }
    },
    {
        "h4": "Toolbar Component"
    },
    {
        "link": {
            "title": "ToolBar  specification",
            "source": "{{toolbar_kb_link}}"
        }
    },
    {
        "h4": "Card List Container"
    },
    {
        "link": {
            "title": "CardList  specification",
            "source": "{{cardlist_kb_link}}"
        }
    },
    {
        "h4": "Card Component"
    },
    {
        "link": {
            "title": "Card  specification",
            "source": "{{card_kb_link}}"
        }
    },
    {
        "h4": "FloatingActionButton Component"
    },
    {
        "link": {
            "title": "FloatingActionButton  specification",
            "source": "{{floatingactionbutton_kb_link}}"
        }
    },
    {
        "h4": "Chip Component"
    },
    {
        "link": {
            "title": "Chip  specification",
            "source": "{{chip_kb_link}}"
        }
    },
    {
        "h4": "ChipList Component"
    },
    {
        "link": {
            "title": "ChipList  specification",
            "source": "{{chiplist_kb_link}}"
        }
    },
    {
        "h4": "ContextMenu Component"
    },
    {
        "link": {
            "title": "ContextMenu  specification",
            "source": "{{contextmenu_kb_link}}"
        }
    },
    {
        "h4": "SpeechToTextButton Component"
    },
    {
        "link": {
            "title": "SpeechToTextButton  specification",
            "source": "{{speechtotextbutton_kb_link}}"
        }
    },
    {
        "h4": "More Actions View - PanelBar Component"
    },
    {
        "link": {
            "title": "PanelBar  specification",
            "source": "{{panelbar_kb_link}}"
        }
    },
    {
        "h3": "Keyboard Shortcuts applicable to the Inline AI Prompt"
    },
    {
        "table": {
            "headers": [
                "Shortcut",
                "Behavior"
            ],
            "rows": [
                {
                    "Shortcut": "`Escape`",
                    "Behavior": "If generating, stops the generation process. If not - closes the Inline AI Prompt popup."
                }
            ]
        }
    },
    {
        "h3": "Keyboard Shortcuts applicable to the Inline AI Prompt `k-input-inner` element"
    },
    {
        "table": {
            "headers": [
                "Shortcut",
                "Behavior"
            ],
            "rows": [
                {
                    "Shortcut": "`Enter`",
                    "Behavior": "Sends the message."
                },
                {
                    "Shortcut": "`Shift + Enter`",
                    "Behavior": "Start a new line in the textarea message box."
                }
            ]
        }
    },
    {
        "h3": "Testing"
    },
    {
        "p": "The AI Prompt has been extensively tested automatically with [axe-core](https://github.com/dequelabs/axe-core) and manually with the most popular screen readers."
    },
    {
        "h3": "Screen Readers"
    },
    {
        "p": "The AI Prompt has been tested with the following screen readers and browsers combinations:"
    },
    {
        "table": {
            "headers": [
                "Environment",
                "Tool"
            ],
            "rows": [
                [
                    "Firefox",
                    "NVDA"
                ],
                [
                    "Chrome",
                    "JAWS"
                ],
                [
                    "Microsoft Edge",
                    "JAWS"
                ]
            ]
        }
    }
]